<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" href="../lib/layui-v2.5.5/css/layui.css" media="all">
    <link rel="stylesheet" href="../lib/jq-module/zyupload/zyupload-1.0.0.min.css" media="all">
    <link rel="stylesheet" href="../css/public.css" media="all">
</head>
<body>
<div class="layuimini-container">
    <div class="layuimini-main">
        <blockquote class="layui-elem-quote">
            <h1>批量导入学生信息</h1>
        </blockquote>
        <blockquote class="layui-elem-quote">
            通过Excel表格批量导入学生信息，请按照模板格式来填写Excel表格，不要修改表格中数据的列顺序，以避免导入失败。<br>
            如果自动添加的信息有误，请手动修改。<br/>
            <a href="../学生导入模板.xlsx" target="_blank" class="layui-btn layui-btn-danger">导入模板下载</a>
        </blockquote>
        <div id="student" class="zyupload"></div>
</div>
</div>

<script src="../lib/jquery-3.4.1/jquery-3.4.1.min.js" charset="utf-8"></script>
<script src="../lib/layui-v2.5.5/layui.js" charset="utf-8"></script>
<script src="../lib/jq-module/zyupload/zyupload-1.0.0.min.js" charset="utf-8"></script>
<script type="text/javascript">
    layui.use(['form', 'table', 'layer'], function () {
        var layer = layui.layer;

        // 初始化插件
        $("#student").zyUpload({
            width: "650px",                 // 宽度
            height: "400px",                 // 宽度
            itemWidth: "140px",                 // 文件项的宽度
            itemHeight: "115px",                 // 文件项的高度
            url: "/batchAddStudent",  // 上传文件的路径
            fileType: ["xlsx", "xls"],// 上传文件的类型
            fileSize: 51200000,                // 上传文件的大小
            multiple: false,                    // 是否可以多个文件上传
            dragDrop: true,                    // 是否可以拖动上传文件
            tailor: false,                    // 是否可以裁剪图片
            del: true,                    // 是否可以删除文件
            finishDel: false,  				  // 是否在上传文件完成后删除预览
            /* 外部获得的回调接口 */
            onSelect: function (selectFiles, allFiles) {
                // 选择文件的回调方法  selectFile:当前选中的文件  allFiles:还没上传的全部文件

            },
            onDelete: function (file, files) {
                // 删除一个文件的回调方法 file:当前删除的文件  files:删除之后的文件

            },
            onSuccess: function (file, response) {
                // 文件上传成功的回调方法
                layer.alert("上传成功，正在导入，请稍后查看...");
            },
            onFailure: function (file, response) {
                // 文件上传失败的回调方法
                console.info("此文件上传失败：");
                console.info(file.name);
            },
            onComplete: function (response) {
                // 上传完成的回调方法
                console.info("文件上传完成");
                console.info(response);
            }
        });

    });
</script>

</body>
</html>